<template>
	<!-- title部分 -->
	<view class="titlebox">
		<image class="titlebox-backimg" src="../../static/上一步.png" @click="gotoIndex"></image>
		<view class="titlebox-titletext">全民分享</view>
	</view>

	<!-- data部分 -->
	<view class="databox">
		<view class="databox-datafirstbox">
			<view class="databox-datafirstbox-nrbox">
				<view class="databox-datafirstbox-nrbox-text">累计发放佣金：</view>
				<view class="databox-datafirstbox-nrbox-digitalText">17465.25</view>
			</view>
			<view class="databox-datafirstbox-nrbox">
				<view class="databox-datafirstbox-nrbox-text">今日发放佣金：</view>
				<view class="databox-datafirstbox-nrbox-digitalText">17465.22</view>
			</view>
		</view>

		<view class="databox-datasecondbox">
			<view class="databox-datasecondbox-nrbox">
				<view class="databox-datasecondbox-nrbox-text">累计项目数量：</view>
				<view class="databox-datasecondbox-nrbox-digitalText">17465.25</view>
			</view>
			<view class="databox-datasecondbox-nrbox">
				<view class="databox-datasecondbox-nrbox-text">违规下架项目数量：</view>
				<view class="databox-datasecondbox-nrbox-digitalText">17465.25</view>
			</view>
			<view class="databox-datasecondbox-nrbox">
				<view class="databox-datasecondbox-nrbox-text">违规封禁禁发布者数量：</view>
				<view class="databox-datasecondbox-nrbox-digitalText">17465.25</view>
			</view>
		</view>
	</view>

	<!-- warn部分 -->
	<view class="warnbox">
		<view class="warnbox-icon"></view>
		<view class="warnbox-text">禁止发任何违规项目，一旦发现，永久封禁</view>
	</view>

	<!-- recommend部分 -->
	<view class="recommend">
		<view class="recommendbox-text">优质项目推荐</view>
		<view class="recommendbox">

			<view class="projectbox">
				<image class="projectbox-img" src="../../static/logo.png"></image>

				<view class="projectbox-textbox">
					<view class="projectbox-textbox-nametext">ps在线接单兼职项目在线...</view>
					<view class="projectbox-textbox-tipstext">要求会ps抠图，修图，制作名片制...</view>
					<view class="projectbox-textbox-sharenunber">已有186人分享</view>
				</view>

				<view class="projectbox-functionbox">
					<view class="projectbox-functionbox-share">分享赚3元</view>
					<view class="projectbox-functionbox-check">查看详情</view>
				</view>
			</view>
		</view>

		<view class="recommendbox">

			<view class="projectbox">
				<image class="projectbox-img" src="../../static/logo.png"></image>

				<view class="projectbox-textbox">
					<view class="projectbox-textbox-nametext">ps在线接单兼职项目在线...</view>
					<view class="projectbox-textbox-tipstext">要求会ps抠图，修图，制作名片制...</view>
					<view class="projectbox-textbox-sharenunber">已有186人分享</view>
				</view>

				<view class="projectbox-functionbox">
					<view class="projectbox-functionbox-share">分享赚3元</view>
					<view class="projectbox-functionbox-check">查看详情</view>
				</view>
			</view>
		</view>

		<view class="recommendbox">

			<view class="projectbox">
				<image class="projectbox-img" src="../../static/logo.png"></image>

				<view class="projectbox-textbox">
					<view class="projectbox-textbox-nametext">ps在线接单兼职项目在线...</view>
					<view class="projectbox-textbox-tipstext">要求会ps抠图，修图，制作名片制...</view>
					<view class="projectbox-textbox-sharenunber">已有186人分享</view>
				</view>

				<view class="projectbox-functionbox">
					<view class="projectbox-functionbox-share">分享赚3元</view>
					<view class="projectbox-functionbox-check">查看详情</view>
				</view>
			</view>
		</view>




		<view class="recommendbox-text">普通项目推荐</view>
		<view class="recommendbox">

			<view class="projectbox">
				<image class="projectbox-img" src="../../static/logo.png"></image>

				<view class="projectbox-textbox">
					<view class="projectbox-textbox-nametext">ps在线接单兼职项目在线...</view>
					<view class="projectbox-textbox-tipstext">要求会ps抠图，修图，制作名片制...</view>
				</view>

				<view class="projectbox-functionbox">
					<view class="projectbox-functionbox-check">查看详情</view>
				</view>
			</view>
		</view>

		<view class="recommendbox">

			<view class="projectbox">
				<image class="projectbox-img" src="../../static/logo.png"></image>

				<view class="projectbox-textbox">
					<view class="projectbox-textbox-nametext">ps在线接单兼职项目在线...</view>
					<view class="projectbox-textbox-tipstext">要求会ps抠图，修图，制作名片制...</view>
				</view>

				<view class="projectbox-functionbox">
					<view class="projectbox-functionbox-check">查看详情</view>
				</view>
			</view>
		</view>

		<view class="recommendbox">

			<view class="projectbox">
				<image class="projectbox-img" src="../../static/logo.png"></image>

				<view class="projectbox-textbox">
					<view class="projectbox-textbox-nametext">ps在线接单兼职项目在线...</view>
					<view class="projectbox-textbox-tipstext">要求会ps抠图，修图，制作名片制...</view>
				</view>

				<view class="projectbox-functionbox">
					<view class="projectbox-functionbox-check">查看详情</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {

			}
		},
		methods: {
			gotoIndex() {
				// 在tabbar中使用uniapp的switchTab方法跳转
				uni.switchTab({
					url: '/pages/index/index', // 我的路径
				});
			},
		}
	}
</script>

<style>
	page {
		background: #F6F6F6;
	}

	.titlebox {
		padding: 2%;
		display: flex;
		align-items: center;
		justify-content: center;
		margin-bottom: 10px;
		/* 添加这一行来水平居中 */
	}

	/* title部分样式 */
	.titlebox-backimg {
		width: 15px;
		height: 15px;
	}

	.titlebox-titletext {
		margin-left: auto;
		margin-right: auto;
		font-size: 15px;
		/* color: #333; */
		font-weight: 600;
	}

	/* data部分样式 */
	.databox {
		width: 95%;
		margin: 0 auto;
		border-radius: 10px;
		background: linear-gradient(to bottom right, rgb(244, 177, 50), rgb(245, 230, 110));
		margin-bottom: 10px;
	}

	.databox-datafirstbox {
		padding: 4%;
		display: flex;
		align-items: center;
	}

	.databox-datafirstbox-nrbox {
		width: 45%;
	}

	.databox-datafirstbox-nrbox-text {
		font-size: 15px;
		color: rgb(150, 115, 30);
	}

	.databox-datafirstbox-nrbox-digitalText {
		font-size: 15px;
	}

	.databox-datasecondbox {
		padding: 4%;
		display: flex;
		align-items: center;
		gap: 2%;
	}

	.databox-datasecondbox-nrbox {
		/* width: 30%; */
	}

	.databox-datasecondbox-nrbox-text {
		font-size: 23rpx;
		color: rgb(150, 115, 30);
	}

	.databox-datasecondbox-nrbox-digitalText {
		font-size: 12px;
	}

	/* warn部分 */
	.warnbox {
		display: flex;
		align-items: center;
		width: 91%;
		margin: 0 auto;
		border-radius: 10px;
		margin-bottom: 10px;
		background: white;
		padding: 2%;

	}

	.warnbox-icon {
		width: 5px;
		height: 5px;
		background: rgb(245, 230, 110);
		border-radius: 50px;
		margin-right: 5px;
	}

	.warnbox-text {
		font-size: 13px;
		white-space: nowrap;
	}

	/* recommend部分 */
	.recommend {
		padding-bottom: 10%;
	}

	.recommendbox-text {
		font-size: 15px;
		padding: 2%;
		font-weight: 600;
	}

	.recommendbox {
		width: 91%;
		padding: 2%;
		border-radius: 10px;
		display: flex;
		align-items: center;
		background: white;
		margin: 0 auto 10px;
	}

	.projectbox {
		display: flex;
		align-items: center;
		width: 100%;
		padding: 2%;
	}

	.projectbox-img {
		width: 20%;
		height: 60px;
		display: block;
		margin-right: 2%;
	}

	.projectbox-textbox {
		margin-right: auto;
		display: flex;
		flex-wrap: wrap;
		width: 55%;
	}

	.projectbox-textbox-nametext {
		font-size: 15px;
		font-weight: 500;
		white-space: nowrap;
		/* 防止文本换行: ; */
		overflow: hidden;
		/* 隐藏溢出的文本: ; */
		text-overflow: ellipsis;
	}

	.projectbox-textbox-tipstext {
		font-size: 10px;
		color: rgb(160, 160, 160);
		margin-bottom: 5px;
		white-space: nowrap;
		/* 防止文本换行: ; */
		overflow: hidden;
		/* 隐藏溢出的文本: ; */
		text-overflow: ellipsis;
	}

	.projectbox-textbox-sharenunber {
		padding: 2%;
		border-radius: 7px;
		border: 1px solid;
		font-size: 10px;
		color: orangered;
	}

	.projectbox-functionbox {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		justify-content: flex-end;
		width: 25%;
	}

	.projectbox-functionbox-share {
		font-size: 10px;
		padding: 10% 15%;
		border-radius: 20px;
		background-color: rgb(245, 230, 110);
		margin-bottom: 5px;
	}

	.projectbox-functionbox-check {
		font-size: 10px;
		padding: 10% 17%;
		border-radius: 20px;
		background-color: white;
		border: 1px solid #eee;
	}
</style>
